

@extends('public.father')
@section('content')

<main class="main-content">
    <div class="breadcrumb-wrapper">
        <nav class="breadcrumb" role="navigation" aria-label="breadcrumbs">
            <a href="index.html" title="Back to the frontpage">Home</a>
            <span aria-hidden="true">&rsaquo;</span>
            <span>Login Page</span>
        </nav>
        <h1 class="section-header__title">Login Page</h1>
    </div>
    <div class="wrapper">
        <div class="grid">
            <div class="grid__item">
                <div class="grid">
                    <div class="grid__item large--one-third push--large--one-third text-center">
                        <div class="note form-success" id="ResetSuccess" style="display:none;">
                            We've sent you an email with a link to update your password.
                        </div>
                        <div id="CustomerLoginForm" class="form-vertical">
                            <form method="post" action="#" id="customer_login" accept-charset="UTF-8">
                                <input type="hidden" value="customer_login" name="form_type"><input type="hidden" name="utf8" value="✓">
                                <h3>Login</h3>
                                <label for="CustomerEmail" class="hidden-label">Email</label>
                                <input type="email" name="customer[email]" id="CustomerEmail" class="input-full" placeholder="Email" autocorrect="off" autocapitalize="off" autofocus="">
                                <label for="CustomerPassword" class="hidden-label">Password</label>
                                <input type="password" value="" name="customer[password]" id="CustomerPassword" class="input-full" placeholder="Password">
                                <p>
                                    <input type="submit" class="btn btn2 btn--full" value="Sign In">
                                </p>
                                <p>
                                    <a href="index.html">Return to Store</a>
                                </p>
                                <p>
                                    <a href="" id="RecoverPassword">Forgot your password?</a>
                                </p>
                            </form>
                            <script>
                                $(document).ready(function(){
                                    $("a#RecoverPassword").click(function(event){
                                        event.preventDefault();
                                        timber.cache.$recoverPasswordForm.show();
                                        timber.cache.$customerLoginForm.hide();
                                    });
                                });
                            </script>
                        </div>
                        <div id="RecoverPasswordForm" style="display: none;">
                            <h3>Reset your password</h3>
                            <p>
                                We will send you an email to reset your password.
                            </p>
                            <div class="form-vertical">
                                <form method="post" action="#" accept-charset="UTF-8">
                                    <input type="hidden" value="recover_customer_password" name="form_type"><input type="hidden" name="utf8" value="✓">
                                    <label for="RecoverEmail" class="hidden-label">Email</label>
                                    <input type="email" value="" name="email" id="RecoverEmail" class="input-full" placeholder="Email" autocorrect="off" autocapitalize="off">
                                    <input type="submit" class="btn btn2" value="Submit">
                                    <button type="button" id="HideRecoverPasswordLink" class="text-link btn">Back to Login</button>
                                </form>
                            </div>
                        </div>
                    </div>
                </div>
            </div>
        </div>
    </div>
</main>

    @endsection